<template>
  <view>使用字体图标</view>
  <!-- 1. 使用扩展组件 -->
  <uni-icons type="contact" size="50"></uni-icons>
  <uni-icons type="calendar" size="50"></uni-icons>
  <!-- 2. 使用自定义的字体图标 -->
  <text class="iconfont icon-yonghubiaoqian text1"></text>
  <text class="iconfont icon-yonghuguanbi text1"></text>
  <!-- 3. 用扩展组件去使用字体图标 -->
  <uni-icons custom-prefix="iconfont" type="icon-duoyonghu" size="50"></uni-icons>
  <uni-icons custom-prefix="iconfont" type="icon-yonghuguanbi" size="50"></uni-icons>
  <!-- 4. 使用彩色图标 -->
  <text class="t-colors t-colors-beianguanli img1"></text>
  <!-- <uni-icons custom-prefix="t-colors" type="t-colors-beianguanli" size="150"></uni-icons> -->
</template>

<script></script>

<style>
.text1 {
  font-size: 100rpx;
}

.img1 {
  width: 80rpx;
  height: 80rpx;
  /* background-color: red;
  background-repeat: no-repeat; */
}
</style>
